@import '../../main.less';

.home-container{
    .home-nav{
        height: 46px;
        line-height: 46px;
        border-bottom: @border;
        background-color: #fff;
        box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
        transition: all .2s;
        transform: translateZ(0);
        nav{
            .ct;
            .list;
            ul{
                .list;
                justify-content: center;
                height: 100%;
                margin: 0;
                li{
                    margin-right: 15px;
                    cursor: pointer;
                    a{
                        color: @color6;
                        text-decoration: none;
                    }
                    &:hover{
                        a{
                            color:@primary;
                        }
                    }
                    a.active{
                        color:@primary;
                    }
                }
                // li.activeLi{
                //     a{
                //         color:@primary;
                //     }
                // }
            }
            a{
                height: 100%;
            }
        }
    }
    .secondNav{
        height: 50px;
        line-height: 50px;
        overflow: hidden;
        background: @colorF;
        box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
        .list;
        flex: 1 auto 1;
        justify-content: flex-start;
        ul{
            .list;
            width: 82%;
            height: 100%;
            margin: 0;
            margin-left: 20px;
            justify-content: flex-start;
            li{
                cursor: pointer;
                padding: 0 15px;
                color: @primary;
                display: flex;
                align-items: center;
            }
        }
        >a{
            color:@color6;
            &:hover{
                color: @primary;
            }
        }
    }
    .article-container{
        margin-top: 15px;
        background: @colorF;
        .sort-tag{
            .list;
            height: 46px;
            line-height: 46px;
            border-bottom: 1px solid hsla(0,0%,59.2%,.1);
            &:first-child{
                .ant-tag{
                    position: relative;
                    &::after{
                        content: '|';
                        position: absolute;
                        top: -1px;
                        right: -5px;
                    }
                    &:last-child::after{
                        content: '';
                    }
                }
            }
        }
    }
    .linkCard{
        img{
            width: 36px;
            height: 36px;
        }
        .ant-list-item-meta-title{
            margin: 0;
            margin-top: 7px;
            .overflow-ellipsis;
        }
        .ant-list-item{
            border-bottom: none;
        }
    }
}

.ant-popover-inner-content{
    padding: 0!important;
    ul{
        li:hover{
            background: #f7f8fa;
        }
    }
}

.article-list{
    .ant-list-item{
        justify-content: space-between;
        padding: 15px;
        border-bottom: 1px solid hsla(0,0%,59.2%,.1);
        cursor: pointer;
        &:hover{
            background: #fcfcfc;
            .list-part3 i{
                display: inline-block;
            }
        }
    }
}
.list-part1{
    ul{
        .list;
        justify-content: flex-start;
        li{
            position: relative;
            color: @color6;
            &.item.post{
                font-weight: 500;
                color: rgb(183, 30, 215);
            }
            &::after{
                content: "·";
                color: rgb(178, 186, 194);
                margin: 0px 5px;
            }
            &:last-child::after{
                content: ''
            }
            >a{
                position: relative;
                color: @color6;
                &:hover{
                    color: @primary;
                }
                &::after{
                    content: '/';
                    margin: 0 5px;
                }
                &:last-child::after{
                    content: ''
                }
            }
        }
    }
}
.list-part2{
    a{
        color: #2e3135;
        font-size: 18px;
        font-weight: 600;
        &:hover{
            color: @primary;
            text-decoration: underline;
        }
    }
}
.list-part3>div{
    .list;
    margin-top: 10px;
    justify-content: flex-start;
    .ant-statistic{
        height: 24px;
        line-height: 20px;
        padding: 0 10px;
        white-space: nowrap;
        color: #b2bac2;
        border-radius: 1px;
        border: 1px solid #edeeef;
        .ant-statistic-content{
            font-size: 16px;
        }
        &:first-child{
            border-right: none!important;
        }
        &:hover{
            background: #f7f8fa;
        }
    }
    >i{
        display: none;
        height: 24px;
        line-height: 26px;
        padding: 0 10px;
        white-space: nowrap;
        color: #b2bac2;
        border-radius: 1px;
        border: 1px solid #edeeef;
        &:hover{
            background: #f7f8fa;
        }
    }
    .link-btn{
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 24px;
        border: 1px solid #edeeef;
        border-radius: 1px;
        padding-left: 14px;
        padding-right: 14px;
        color: #b3bac1;
        font-size: 14px;
        white-space: nowrap;
    }
    .link-btn.sale,.link-btn.share{
        margin-left: -1px;
    }
}